body {
    background: #1e1e28; 
    color : white;

}


svg {
    min-width : 500px ;
    min-height : 500px ;
    border : 1px solid black ; 
    background: rgba(220,220,255,0.9) ; 


    background-color: rgba(220,220,255,0.9) ; 
    background-image: linear-gradient(rgba(255,255,255,.3) 2px, transparent 2px),
    linear-gradient(90deg, rgba(255,255,255,.3) 2px, transparent 2px),
    linear-gradient(rgba(255,255,255,.3) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.3) 1px, transparent 1px);
    background-size:100px 100px, 100px 100px, 20px 20px, 20px 20px;
    background-position:-2px -2px, -2px -2px, -1px -1px, -1px -1px; 
    background-color: rgba(220,220,255,0.9) ; 
    background-image: -webkit-linear-gradient(rgba(255,255,255,.3) 2px, transparent 2px),
    -webkit-linear-gradient(0deg, rgba(255,255,255,.3) 2px, transparent 2px),
    -webkit-linear-gradient(rgba(255,255,255,.3) 1px, transparent 1px),
    -webkit-linear-gradient(0deg, rgba(255,255,255,.3) 1px, transparent 1px);
    background-size:100px 100px, 100px 100px, 20px 20px, 20px 20px;
    background-position:-2px -2px, -2px -2px, -1px -1px, -1px -1px
    
}

.infobox {
    display:table ;
    background : rgba(200,200,200,0.7) ;
    border : 1px rgba(120,120,120,0.7) outset ; 
    box-shadow : 2px 2px 3px rgba(0,0,0,0.3) ;
    margin : auto ; 
    padding : 25px ; 

    input {
	border : 1px rgba(200,200,200,0.7) inset ; 
    }

    .ok {
	color : green ; 
    }
    #serverAddress {
	color : red ; 
    }
}



#brainstormingList .ui-selecting { background: #FECA40; }
#brainstormingList .ui-selected { background: #F39814; color: white; }
#brainstormingList { list-style-type: none; margin: 0; padding: 0;  }
#brainstormingList li {
    margin: 3px 0px;
//    padding: 0.4em;  
    height: 18px;
  //  border : 1px rgba(200,200,200,0.7) inset ;
    input {
	width:100%;
	height:100%; 
	box-sizing: border-box;         /* For IE and modern versions of Chrome */
	-moz-box-sizing: border-box;    /* For Firefox                          */
	-webkit-box-sizing: border-box;
	border-width:0px;

	position:relative ;
	top:-2px ; //WHY!!!!!!!
	&:active, &hover {
	background: rgba(100,0,0,0.3); 
	}
    }
 
}
#brainstormingList li:hover { background: #CACA40; }

rect {
    fill: white;
    stroke-width : 3px ; 
    pointer-events: all;
}

.node {
    fill: rgba(0,0,0,0.7) ; 

}

.error{
    display:table ;
    background : rgba(250,20,20,0.7) ;
    border : 1px rgba(220,220,20,0.3) outset ; 
    box-shadow : 2px 2px 3px rgba(250,250,100,0.03), -2px -2px 3px rgba(250,250,100,0.03)   ;
    margin : auto ; 
    padding : 5px ;     
    position : absolute ; 
    top : 10px ; 
    
}

.cursor {
    fill: none;
    stroke: brown;
    pointer-events: none;
}

.link {
    stroke: #333;
    z-index : 1 ; 
    stroke-width:3;
}
text {
    z-index : 10 ; 
    fill : black; 
}

.background {
    // fill : rgba(233,233,233,1);
    z-index : 0 ; 

}

g {
    fill : blue ; 
}


#tapetita{
    position :absolute ;
    top:-100px ; 

    //    top : -10000px; 
}

.current rect {
    stroke-width:3;
    stroke:rgba(226,126,0,0.3)

}
.previous rect {
    stroke-width:2;
    stroke:rgba(226,226,0,0.3)

}

#query{
    width : 500px ; 
    height : 318px ; 
}